<script setup>
import {getReceiveListByDocId} from "@/api/document/exchangeDocument.js";
import {getReceiveStatusStyle} from "@/utils/document.js";
import {backExchangeDocList} from "@/utils/backList.js";

const {proxy} = getCurrentInstance()
const listLoading = ref(false)
const loading = ref(false)
const recordList = ref(null)
const props = defineProps({
  id: {
    type: Number
  }
})

// 列显隐信息
const columns = ref([
  {label: `发文标题`, visible: true},
  {label: `发文字号`, visible: true},
  {label: `发文单位`, visible: true},
  {label: `收文单位`, visible: true},
  {label: `收文用户`, visible: true},
  {label: `签收状态`, visible: true},
  {label: `签收时间`, visible: true}
])

onMounted(() => {
  getRecordList()
})

function getRecordList() {
  listLoading.value = true
  if (props.id) {
    function handleSuccess(res) {
      recordList.value = res
      listLoading.value = false
    }
    function handleError() {
      listLoading.value = false
    }
    getReceiveListByDocId(props.id)
        .then(handleSuccess)
        .catch(handleError)
  }
}

</script>

<template>
  <el-row :gutter="10" class="mb8">
    <el-col :span="1.5">
      <el-button @click="backExchangeDocList">返 回</el-button>
    </el-col>

  </el-row>
  <!-- 表格数据 -->
  <el-table v-loading="loading" :data="recordList" :scrollbar-always-on="(recordList != null) && (recordList.length > 0)">
    <el-table-column :label="columns[0].label" key="subject" prop="subject" v-if="columns[0].visible" min-width="250" :show-overflow-tooltip="true"/>
    <el-table-column :label="columns[1].label" key="docNo" prop="docNo" v-if="columns[1].visible" width="180" :show-overflow-tooltip="true"/>
    <el-table-column :label="columns[2].label" key="sendUnit" prop="sendUnit" v-if="columns[2].visible" width="200" :show-overflow-tooltip="true" />
    <el-table-column :label="columns[3].label" key="receiveDeptName" prop="receiveDeptName" v-if="columns[3].visible" width="150" :show-overflow-tooltip="true" />
    <el-table-column :label="columns[4].label" key="receiveUserName" prop="receiveUserName" v-if="columns[4].visible" width="120" :show-overflow-tooltip="true" />
    <el-table-column :label="columns[5].label" key="status" prop="status" v-if="columns[5].visible" width="80" >
      <template #default="scope">
        <el-tag :type="getReceiveStatusStyle(scope.row.status)"> {{ scope.row.status }} </el-tag>
      </template>
    </el-table-column>
    <el-table-column :label="columns[6].label" key="confirmReceiveTime" prop="confirmReceiveTime" v-if="columns[6].visible" width="180" />
  </el-table>
</template>